import { NavBar } from 'antd-mobile';
import { NavBarProps } from 'antd-mobile/es/components/nav-bar';

import React, { FC } from 'react';
import { useNavigate } from 'react-router-dom';

interface NavbarProp {
  title: string;
  style: any;
}

export type NavbarProps = NavbarProp & Omit<NavBarProps, 'title' | 'style'>;

/**
 *
 * @param props
 * @returns
 * 可以通过传值的方式 修改tiele 保留了navbar之前的属性
 */
export const Navbar: FC<NavbarProps> = (props) => {
  const { title, style, ...remainProps } = props;
  const history = useNavigate();
  return (
    <>
      <NavBar
        {...remainProps}
        onBack={() => {
          history(-1);
        }}
      >
        {title}
      </NavBar>
    </>
  );
};
